import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Item from '../Item';
import './index.css';

export default class List extends Component {

  // 设置 props 的数据类型
  static propTypes = {
    list: PropTypes.array.isRequired,
    updateList: PropTypes.func.isRequired,
    delList: PropTypes.func.isRequired
  }

  render() {
    // 结构 props 传过来的值
    const { list, updateList, delList } = this.props

    return (
      <ul className="todo-main">
     {
       list.map(item => {
         return <Item key={item.id} item= {{ ...item }} updateList={ updateList } delList={ delList }/>
       })
     }
    </ul>
      );
  }
}
